<app-back-btn></app-back-btn>
<div class="page-title">
  <span class="title" *ngIf="!id">添加星级规则</span>
  <span class="title" *ngIf="id">修改星级规则</span>
</div>

<div class="page-msg m-15">
  <h3>功能描述</h3>
  <ul>
    <li *ngFor="let item of msgTip.levelRules">{{item}}</li>
  </ul>
</div>

<div class="panel panel-body">
  <form nz-form [formGroup]="validateForm" class="form-wrap" (submit)="addStarLevelRule($event)">
    <h2 class="subtitle">星级规则信息</h2>

    <!--starLevelCode start-->
    <nz-form-item>
      <nz-form-label [nzSm]="7" nzFor="starLevelCode" nzRequired> 选择星级</nz-form-label>
      <nz-form-control [nzSm]="10" [nzValidateStatus]="getFormControl('starLevelCode')">
        <nz-select formControlName="starLevelCode" id="starLevelCode" [nzPlaceHolder]="'选择星级编码'" [nzDisabled]="id">
          <nz-option *ngFor="let item of starLevelList" [nzValue]="item.code" [nzLabel]="item.name"></nz-option>
        </nz-select>
        <nz-form-explain *ngIf="getFormControl('starLevelCode').dirty&&getFormControl('starLevelCode').errors">
          <ng-container *ngIf="getFormControl('starLevelCode').hasError('required')">请选择星级</ng-container>
        </nz-form-explain>
      </nz-form-control>
      <nz-form-control [nzSm]="7" class="font12 pl color-red">
        不可修改
      </nz-form-control>
    </nz-form-item>

    <!--level start-->
    <nz-form-item>
      <nz-form-label [nzSm]="7" nzFor="level" nzRequired> 层级</nz-form-label>
      <nz-form-control [nzSm]="10" [nzValidateStatus]="getFormControl('level')">
        <input nz-input formControlName="level" type="number" id="level" placeholder="层级" [readonly]="id">
        <nz-form-explain *ngIf="getFormControl('level').dirty&&getFormControl('level').errors">
          <ng-container *ngIf="getFormControl('level').hasError('required')">请输入层级</ng-container>
        </nz-form-explain>
      </nz-form-control>
      <nz-form-control [nzSm]="7" class="font12 pl color-red">
        数字，不可修改
      </nz-form-control>
    </nz-form-item>

    <!--rate start-->
    <nz-form-item>
      <nz-form-label [nzSm]="7" nzFor="rate" nzRequired>动态奖励</nz-form-label>
      <nz-form-control [nzSm]="10" [nzValidateStatus]="getFormControl('rate')">
        <nz-input-group nzAddOnAfter="%">
          <input nz-input formControlName="rate" type="number" id="rate" placeholder="动态奖励百分比">
        </nz-input-group>
        <nz-form-explain *ngIf="getFormControl('rate').dirty&&getFormControl('rate').errors">
          <ng-container *ngIf="getFormControl('rate').hasError('required')">请输入动态奖励百分比</ng-container>
        </nz-form-explain>
      </nz-form-control>
      <nz-form-control [nzSm]="7" class="font12 pl color-gray">
        动态奖励百分比
      </nz-form-control>
    </nz-form-item>

    <!--表单底部start-->
    <nz-form-item class="action-button">
      <nz-form-control class="text-center">
        <button nz-button [nzType]="'primary'" type="submit" class="pl-30 pr-30" [nzLoading]="isConfirmLoading">
          确定
        </button>
      </nz-form-control>
    </nz-form-item>
    <!--表单底部end-->
  </form>

</div>
